<template>
	<view class="mainContent" style="height: 100vh;">
		<view class="header">
			<view class="modular">
				<view class="search">
					<image src="@/static/img/quickly/healthStatus/search@2x.png" mode=""></image>
					<input type="text" placeholder="姓名" v-model="searchVal" @blur="search">
				</view>
			</view>
			
			<view class="navigatorModular">
				<view class="classification">
					<!-- :style="{'transform': 'translateX('+((currentIndex)*-40)+'px)'}" -->
					<div class="classifcation-a" >
						<text :class="currentIndex == index ? 'on' : ''" v-for="(item,index) in classifcationArr" @click="tabClick(index)" :key="index">{{item}} 
							<image src="@/static/img/quickly/healthStatus/dropDown@2x.png" v-show="currentIndex == index"></image>
						</text>
					</div>
				</view>
				<image src="@/static/img/healthStatus/split@2x.png" class="split"></image>
				<image src="@/static/img/quickly/healthStatus/open@2x.png" class="open" @click="bulletFrame = !bulletFrame"></image>
			</view>
		</view>
		
		<view class="listMular">
			<uni-swipe-action v-if="list.length > 0">
				<view class="box" v-for="(item,index) in list" :key="index">
					<image src="@/static/img/quickly/healthStatus/number@2x.png" class="identifier"></image>
					<uni-swipe-action-item :right-options="options"  @click="bindClick(item)">
						<view class="top">
							<text class="assementNumber">{{item.status == 1 ? '评估编号' : item.sn}}</text>
							<text :class="item.status == 1 ? 'dataTime1' : 'dataTime'">{{item.status == 1? '未评估' : item.fillFormDate}}</text>
						</view>
						<view class="bottom">
							<view class="nameBox">
								<text class="userName">{{item.userName}}</text>
							</view>
							<view class="buttonBox">	
								<view class="qsDetail" @click="detail(item)">详情</view>
								<view class="applyFor" v-if="item.status == 1" @click="creat(item)">生成评估</view>
								<view class="generating" v-else-if="item.status == 2">生成中</view>
								<view class="viewAssessment" v-else @click="read(item)">查看报告</view>
							</view>
						</view>
					</uni-swipe-action-item>
				</view>
			</uni-swipe-action>
			
			<view class="noData" v-else>
				<image src="@/static/img/healthStatus/none.png"></image>
				<view>您还没有评估文件~</view>
			</view>
		</view>	
		
		<view class="location">
			<image src="@/static/img/quickly/healthStatus/add@2x.png"  @click="addQuestion"></image>
		</view>
		
		<reportImgType ref="reportImgType" :info="info" v-if="currentIndex == 0"></reportImgType>
		<reportImgType1 ref="reportImgType1" :info="info" v-if="currentIndex == 1"></reportImgType1>
		<reportImgType2 ref="reportImgType2" :info="info" v-if="currentIndex == 2"></reportImgType2>
		<reportImgType3 ref="reportImgType3" :info="info" v-if="currentIndex == 3"></reportImgType3>
		<reportImgType4 ref="reportImgType4" :info="info" v-if="currentIndex == 4"></reportImgType4>
		
		<!-- 自定义弹框 -->
		<view class="mask" v-if="bulletFrame" @click="bulletFrame = false"></view>
		<view class="uniPop" v-if="bulletFrame">
			<view class="navigatorModular" v-for="(aitem,aindex) in classifcationArr" :key="aindex" @click="navigationClick(aindex)">
				<image src='@/static/img/futureDiseases/hypertensionIcon-On@2x.png' v-if="aindex == 0 && currentIndex == 0"></image>
				<image src='@/static/img/futureDiseases/hypertensionIcon@2x.png' v-else-if="aindex == 0"></image>
				<image src="@/static/img/futureDiseases/diabetesIcon-On@2x.png" v-if="aindex == 1 && currentIndex == 1"></image>
				<image src="@/static/img/futureDiseases/diabetesIcon@2x.png" v-else-if="aindex == 1"></image>
				<image src="@/static/img/futureDiseases/obesityIcon-On@2x.png" v-if="aindex == 2 && currentIndex == 2"></image>
				<image src="@/static/img/futureDiseases/obesityIcon@2x.png" v-else-if="aindex == 2"></image>
				<image src="@/static/img/futureDiseases/metsIcon-On@2x.png" v-if="aindex == 3 && currentIndex == 3"></image>
				<image src="@/static/img/futureDiseases/metsIcon@2x.png" v-else-if="aindex == 3"></image>
				<image src="@/static/img/futureDiseases/cardiovascularIcon-On@2x.png" v-if="aindex == 4 && currentIndex == 4"></image>
				<image src="@/static/img/futureDiseases/cardiovascularIcon@2x.png" v-else-if="aindex == 4"></image>
				<view :class="aindex == currentIndex ? 'checked' : ''">{{aitem}}</view>
			</view>
			<view class="navigatorModular"></view>
			<view class="navigatorModular"></view>
		</view>
	</view>
</template>
<script>
	import reportImgType from './reportImgType.vue'
	import reportImgType1 from './diabetes/reportImgType.vue'
	import reportImgType2 from './obesity/reportImgType.vue'
	import reportImgType3 from './metabolize/reportImgType.vue'
	import reportImgType4 from './cardiovascular/reportImgType.vue'
	export default{
		components:{
			reportImgType,
			reportImgType1,
			reportImgType2,
			reportImgType3,
			reportImgType4
		},
		data() {
			return {
				classifcationArr:['高血压','糖尿病','肥胖','代谢综合征','ICVD'],
				currentIndex:0,
				list:[],
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#EE2437' // 删除按钮背景  红的
					}
				}],
				info:{},
				bulletFrame: false, //自定义弹框
				page:1,
				isNull:false,
				searchVal:''
			}
		},
		onReachBottom(){
			if(this.isNull){
				return;
			}
			this.page = Number(this.page) + 1
			const upload = Number(this.currentIndex)+1 
			this.getData(upload,{pageIndex:this.page,pageSize:10})
		},
		onLoad(options){
			if(options.current){
				this.currentIndex = options.current
				this.tabClick(Number(options.current))
			}else{
				this.tabClick(0)
			}
		},
		methods:{
			search(){
				this.list = []
				this.isNull = false
				this.page = 1
				const upload = Number(this.currentIndex)+1 
				this.getData(upload,{pageIndex:1,pageSize:10,userName:this.searchVal})
			},
			navigationClick(e) {
				uni.pageScrollTo({
					scrollTop:0
				})
				this.list = []
				this.currentIndex = e,
				this.bulletFrame = false
				this.page = 1
				const upload = Number(e)+1
				this.getData(upload,{pageIndex:1,pageSize:10,userName:this.searchVal})
			},
			// 申请评估
			creat(item){
				const _this = this;
				uni.showLoading({title:'加载中'})
				if(this.currentIndex == 0 || this.currentIndex == 2 || this.currentIndex == 4){
					uni.showLoading({title:'加载中'})
					_this.info = item
					setTimeout(()=>{
						(this.currentIndex == 0 ? _this.$refs.reportImgType : this.currentIndex == 2 ? _this.$refs.reportImgType2 : this.currentIndex == 4 ? _this.$refs.reportImgType4 : '').toImg().then((base64)=>{
							var arr = base64.split(',')
							var mime = arr[0].match(/:(.*?);/)[1]
							var bstr = atob(arr[1]) 
							var nn = bstr.length 
							var u8arr = new Uint8Array(nn);
							while(nn--){
								u8arr[nn] = bstr.charCodeAt(nn);
							}
							var obj = new Blob([u8arr], {type:mime});
							var formData = new FormData()
							formData.append('fileOne ', obj)  
							_this.$api.appSicknessDangeUpdateUploadWord(item.id,formData).then((ares) => {
								uni.hideLoading()
								if(ares.data.returnCode == 200){
									window.location.href = 'http://health.jlm12580.com/web/viewer.html?file='+ares.data.result.url
								}
							})
						})
					},1000)
				}else if(this.currentIndex == 1){
					var appUserTopicsEntities = []
					_this.$api.appDiseaseDangeDetail(item.id).then((res)=>{
						res.data.result.userTopicsEntities.map((a)=>{
							appUserTopicsEntities.push({
								titleId:a.titleId,
								id:a.id,
								userOption: a.userOption,
								userValue: a.userValue,
								type:a.type
							})
						})
						const data = {
							appUserTopicsEntities:appUserTopicsEntities,
							status: 3,
							type: 9,
							userHealthId:res.data.result.userHealthId,
							userHealthName:res.data.result.userHealthName,
							userId:res.data.result.userId,
							title: 45,
							source: 3,
							userName: res.data.result.userName,
							assessmentDate:res.data.result.assessmentDate,
							id:item.id
						}
						_this.$api.appDiseaseDangeReport(data).then((res2)=>{
							if (res2.data.returnCode == 200) {
								uni.showLoading({title:'加载中'})
								_this.info = res2.data.result
								setTimeout(()=>{
									_this.$refs.reportImgType1.toImg().then((base64)=>{
										var arr = base64.split(',')
										var mime = arr[0].match(/:(.*?);/)[1]
										var bstr = atob(arr[1]) 
										var nn = bstr.length 
										var u8arr = new Uint8Array(nn);
										while(nn--){
											u8arr[nn] = bstr.charCodeAt(nn);
										}
										var obj = new Blob([u8arr], {type:mime});
										var formData = new FormData()
										formData.append('fileOne ', obj)  
										_this.$api.appSicknessDangeUpdateUploadWord(item.id,formData).then((ares) => {
											if(ares.data.returnCode == 200){
												uni.hideLoading()
												window.location.href = 'http://health.jlm12580.com/web/viewer.html?file='+ares.data.result.url
											}
										})
									})
								},1000)
							}
						})
					})
				}else if(this.currentIndex == 3){
					var appUserTopicsEntities = []
					_this.$api.appDiseaseDangeDetail(item.id).then((res)=>{
						res.data.result.userTopicsEntities.map((a)=>{
							appUserTopicsEntities.push({
								titleId:a.titleId,
								id:a.id,
								userOption: a.userOption,
								userValue: a.userValue,
								type:a.type
							})
						})
						const data = {
							appUserTopicsEntities:appUserTopicsEntities,
							status: 3,
							type: 9,
							userHealthId:res.data.result.userHealthId,
							userHealthName:res.data.result.userHealthName,
							userId:res.data.result.userId,
							title: 45,
							source: 3,
							userName: res.data.result.userName,
							assessmentDate:res.data.result.assessmentDate,
							id:item.id
						}
						_this.$api.appDiseaseDangedxzhReport(data).then((res2)=>{
							if (res2.data.returnCode == 200) {
								uni.showLoading({title:'加载中'})
								_this.info = res2.data.result
								setTimeout(()=>{
									_this.$refs.reportImgType3.toImg().then((base64)=>{
										var arr = base64.split(',')
										var mime = arr[0].match(/:(.*?);/)[1]
										var bstr = atob(arr[1]) 
										var nn = bstr.length 
										var u8arr = new Uint8Array(nn);
										while(nn--){
											u8arr[nn] = bstr.charCodeAt(nn);
										}
										var obj = new Blob([u8arr], {type:mime});
										var formData = new FormData()
										formData.append('fileOne ', obj)  
										_this.$api.appSicknessDangeUpdateUploadWord(item.id,formData).then((ares) => {
											if(ares.data.returnCode == 200){
												uni.hideLoading()
												window.location.href = 'http://health.jlm12580.com/web/viewer.html?file='+ares.data.result.url
											}
										})
									})
								},1000)
							}
						})
					})
				}
			},
			tabClick(e) {
				uni.pageScrollTo({
					scrollTop:0
				})
				this.currentIndex = e
				this.page = 1
				this.list = []
				const upload = Number(e)+1
				this.getData(upload,{pageIndex:1,pageSize:10,userName:this.searchVal})
			},
			getData(e,data){
				const _this = this;
				data.type = Number(e) + 7;
				if(this.currentIndex == 0 || this.currentIndex == 2 || this.currentIndex == 4){
					_this.$api.appSicknessDangeList(data).then((res)=>{
						_this.list = _this.list.length > 0 ? _this.list.concat(res.data.result.list) : res.data.result.list
						if(_this.list.length >= res.data.result.totalCount){
							_this.isNull = true
						}else{
							_this.isNull = false
						}
					})
				}else if(this.currentIndex == 1 || this.currentIndex == 3){
					_this.$api.appDiseaseDangeList(data).then((res)=>{
						_this.list = _this.list.length > 0 ? _this.list.concat(res.data.result.elements) : res.data.result.elements
						if(_this.list.length >= res.data.result.totalCount){
							_this.isNull = true
						}else{
							_this.isNull = false
						}
					})
				}
				
			},
			addQuestion() {
				uni.navigateTo({
					url:'/pages/futureDiseases/navigatorBar'
				})
			},
			// 问卷详情
			detail(item){
				if(item.status == 1){
					// 编辑
					if(this.currentIndex == 2){
						uni.navigateTo({url:`/pages/futureDiseases/obesity/index?edit=1&id=${item.id}`})
					}else if(this.currentIndex == 3){
						uni.navigateTo({url:`/pages/futureDiseases/metabolize/index?edit=1&id=${item.id}`})
					}else if(this.currentIndex == 0){
						uni.navigateTo({url:`/pages/futureDiseases/hypertension/index?edit=1&id=${item.id}`})
					}else if(this.currentIndex == 4){
						uni.navigateTo({url:`/pages/futureDiseases/cardiovascular/index?edit=1&id=${item.id}`})
					}else if(this.currentIndex == 1){
						uni.navigateTo({url:`/pages/futureDiseases/diabetes/index?edit=1&id=${item.id}`})
					}
				}else{
					// 已签发-查看详情
					if(this.currentIndex == 2){
						uni.navigateTo({url:`/pages/futureDiseases/obesity/toView?id=${item.id}&userId=${item.userId}`})
					}else if(this.currentIndex == 3){
						uni.navigateTo({url:`/pages/futureDiseases/metabolize/toView?id=${item.id}&userId=${item.userId}`})
					}else if(this.currentIndex == 0){
						uni.navigateTo({url:`/pages/futureDiseases/hypertension/toView?edit=1&id=${item.id}&userId=${item.userId}`})
					}else if(this.currentIndex == 4){
						uni.navigateTo({url:`/pages/futureDiseases/cardiovascular/toView?id=${item.id}&userId=${item.userId}`})
					}else if(this.currentIndex == 1){
						uni.navigateTo({url:`/pages/futureDiseases/diabetes/toView?id=${item.id}&userId=${item.userId}`})
					}
				}
			},
			bindClick(item){
				const _this = this;
				if(this.currentIndex == 0 || this.currentIndex == 2 || this.currentIndex == 4){
					_this.$api.appSicknessDangeDelete(item.id).then((res)=>{
						_this.tabClick(_this.currentIndex)
					})
				}else if(this.currentIndex == 1 || this.currentIndex == 3){
					_this.$api.appDiseaseDangeDelete(item.id).then((res)=>{
						_this.tabClick(_this.currentIndex)
					})
				}
			},
			// 查看报告
			read(item){
				window.location.href = 'http://health.jlm12580.com/web/viewer.html?file='+item.url
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/css/quickly/healthStatus/navigation.scss';
	.classifcation-a {
		width: 680upx !important;
	}
	/deep/ .uni-swipe_box{
		display: block !important;
	}
	/deep/.uni-swipe_button{
		padding: 0 20rpx;
		margin-left: 10rpx;
	}
	.listMular{
		padding-bottom: 70rpx;
	}
</style>
